<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件-prop</title>
</head>
<body>
    <div id="example-2">
        <input type="text" v-model="parentMsg">
        <child v-bind:my-msg="parentMsg"></child>
        <!--{{* msg}}处理单次插值-->
        <p>{{*parentMsg}}</p>
    </div>
<script src="../lib/vue.js"></script>
<script>
    Vue.component('child',{
        //声明props
        props : ['myMsg'],
            //prop可以在模板内
            //可以用“this.msg”设置
            //HTML特性不区分大小写，在js中写成驼峰形式，在html中必须以my-msg形式使用
            template : '<span>{{myMsg}}</span>'
    })
    var exampleVm = new Vue({
        el : "#example-2",
        data : {
            parentMsg : "hello vue.js"
        }
    })

</script>
</body>
</html>